<template>
  <div>
    <van-grid square>
      <van-grid-item 
            v-for="(item) in items" 
            :key="item.text"
            :text="item.text"
            :icon="item.photo"
            @click="cygrid(item)"
      />
    </van-grid>
  </div>
</template>

<script>
import Vue from "vue";
import { Grid, GridItem,Image } from "vant";
import { getHomeClassifyList } from "@/api/homeClassifyList.js";


Vue.use(Grid);
Vue.use(GridItem);
Vue.use(Image);
export default {
  data() {
    return {
        item:'',
        photo:'',
        items:[],
        homeClassifyList:[],      
    };
  },
  methods:{
    cygrid(item){
      var item = JSON.stringify(item)
      this.$router.push(
        {
          name: 'Classify',
          params: {
            item
          }
        }
      )
      // console.log(item)
    },
    async getDate(){
      let rs = await getHomeClassifyList()
      this.homeClassifyList = rs.data.body.result.filterList
      for (var i = 0; i < this.homeClassifyList.length; i++) {
        var result = this.homeClassifyList[i].list.map(child => {
          return {
            text: child.name,
            id: child.id,
            checked: child.checked
          };
        });
        this.items.push({
          text: this.homeClassifyList[i].itemName,
          itemType: this.homeClassifyList[i].itemType,
          itemId:this.homeClassifyList[i].itemId,
          photo:this.homeClassifyList[i].photo,
          children: result
        });
      }
    },
  },
  created() {
    this.getDate()
  },
  computed: {
    
  }
};
</script>

<style lang="stylus" scoped></style>